<template>
  <div>
    <!-- 顶部标题栏 -->
    <van-nav-bar
      title="黑马优购"
      left-text="返回"
      left-arrow
      @click-left="$router.go(-1)"
      placeholder=""
      fixed
      style="background-color:red;color:#fff;position: relative;"
    />
    <!-- 商品列表展示 -->
    <van-card
      v-for="(item,i) in goodsList"
      :key="i"
      :price="item.goods_price"
      :title="item.goods_name"
      :thumb="item.goods_small_logo"
      @click="$router.push(`/showgoods/?goods_id=${item.goods_id}`)"
    />
    <div style="color:#969799;font-size:14px;line-height: 50px;
    text-align:center;">没有更多了</div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      goodsList: []
    };
  },
  created() {
    this.getList();
  },
  methods: {
    // 请求商品数据
    async getList() {
      console.log(this.$route.query);
      const res = await this.$http.get(`/goods/search`, {
        params: this.$route.query
      });
      this.goodsList = res.message.goods;
      console.log(this.goodsList);
    }
  }
};
</script>

<style lang="less" scoped>
.van-row--justify-center {
  height: 47px;
  line-height: 47px;
  text-align: center;
  font-size: 13px;
  color: #3c3c3c;
}
.van-nav-bar__title,
.van-nav-bar__text,
.van-icon-arrow-left::before {
  color: #fff;
  text-align: center;
}

.van-card__price {
  color: red;
}
</style>